<html>
	<head>
		<meta charset="UTF-8">
		<title>角色管理</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<link rel="stylesheet" href="../../layui/css/layui.css" />
		<link rel="stylesheet" href="../../css/bass.css" />
	</head>

	<body>
		<div class="body">
			<header class="layui-nav" id="headerTop"></header>
			<div class="left_muen" id="left_menu"></div>
			<div class="content_body">
				
				<!--标题栏-->
				<p class="content_title">账号管理 &nbsp;&nbsp;>&nbsp;&nbsp;角色管理</p>
				<!--标题栏-->
				
				<!--条件查询-->
				<div class="content_seach">
					<div class="layui-form">
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label">角色名称</label>
								<div class="layui-input-inline">
									<input type="text" name="roleName" id="roleName" autocomplete="off" class="layui-input">
								</div>
							</div>
							<button class="layui-btn layui-btn-warm search layui-btn-sm" id="search" lay-submit=""  lay-filter="search"><i class="layui-icon">&#xe615;</i>查询</button>
						</div>
					</div>
				</div>
				<!--条件查询-->
				
				<!--表格-->
				<div class="content_table">
					<script type="text/html" id="toolbarDemo">
						<div class="layui-btn-container">
							<a href="./roleAdd.html?pos=5&childPos=3" class="layui-btn layui-btn-sm">
								<i class="layui-icon">&#xe654;</i> 添加
							</a>
						</div>
					</script>
					<div class="tabTable">
						<table id="table" lay-filter="tableFilter"></table>
						<div class="layui-table-page fr">
							<div id="layui-table-page1"></div>
						</div>
					</div>
				</div>
				<!--表格-->
			</div>
			
		</div>
		<script src="../../js/common/jquery-1.11.3.min.js"></script>
		<script src="../../layui/layui.js"></script>
		<script src="../../js/common/navList.js"></script>
		<script src="../../js/common/ajax.js"></script>
		<script type="text/html" id="toolbarOperation">
			<a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon">&#xe642;</i>编辑</a>
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon">&#xe640;</i>删除</a>
		</script>
		<script>
			layui.use(['table', 'laydate'], function(){
				var table = layui.table,form = layui.form,laydate = layui.laydate;

				//列表渲染
				ajaxTable({
					idNode: '#table',
					url:'role/getList',
					dataCols:[ 
						{fixed: true,checkbox: true,height: 180,align: 'center'},
						{field: 'id',title: '角色编号',align: 'center',sort: true}, 
						{field: 'roleName',title: '角色名称',align: 'center'},
						{field: 'roleDesc',title: '权限描述',align: 'center'}, 
						{field: 'createDate',title: '创建时间',align: 'center',sort: true}, 
						{field: 'right', title: '操作', toolbar:"#toolbarOperation",align: 'center'}
					]
				});
				
				//条件查询
				form.on('submit(search)', function(data){
					var roleName=$("#roleName").val();
					ajaxTable({
						idNode: '#table',
						type: "GET",
						url: "role/getList",
						urlParme: "&roleName="+roleName,
						dataCols:[ 
							{fixed: true,checkbox: true,height: 180,align: 'center'},
							{field: 'id',title: '角色编号',align: 'center',sort: true}, 
							{field: 'roleName',title: '角色名称',align: 'center'},
							{field: 'roleDesc',title: '权限描述',align: 'center'}, 
							{field: 'createDate',title: '创建时间',align: 'center',sort: true}, 
							{field: 'right', title: '操作', toolbar:"#toolbarOperation",align: 'center'}
						],
						successFull: function (res, curr, count) {
							console.log(res)
						}
					});
				});
				
				//监听工具条
				table.on('tool(tableFilter)', function(obj){
					var data = obj.data;
					if(obj.event === 'detail'){
						layer.msg('ID：'+ data.id + ' 的查看操作');
					} else if(obj.event === 'del'){
						layer.confirm('确定删除吗？', function(index){
							console.log(data);
							$.ajax({
								url: baseUrl+"/role/del",
								type: "POST",
								data:{"id":data.id},
								dataType: "json",
								success: function(data){
									if(data.code==200){
										obj.del();
										layer.close(index);
										layer.msg("删除成功", {icon: 6});
									}else{
										layer.msg("删除失败", {icon: 5});
									}
								}
							});
						});
					} else if(obj.event === 'edit'){
						layer.confirm('确定修改吗？', function(index){
							location.href="./roleEdit.html?pos=5&childPos=3&id="+data.id;
						});
					}
				});
				
				
				
			});
		</script>
				
	</body>
</html>